<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<title>OKAir内部-登录</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="description" content="Charisma, a fully featured, responsive, HTML5, Bootstrap admin template.">
		<meta name="author" content="Muhammad Usman">

		<!-- The styles -->
		<link id="bs-css" href="css/bootstrap-cerulean.min.css" rel="stylesheet">

		<link href="css/charisma-app.css" rel="stylesheet">
		<link href='bower_components/fullcalendar/dist/fullcalendar.css' rel='stylesheet'>
		<link href='bower_components/fullcalendar/dist/fullcalendar.print.css' rel='stylesheet' media='print'>
		<link href='bower_components/chosen/chosen.min.css' rel='stylesheet'>
		<link href='bower_components/colorbox/example3/colorbox.css' rel='stylesheet'>
		<link href='bower_components/responsive-tables/responsive-tables.css' rel='stylesheet'>
		<link href='bower_components/bootstrap-tour/build/css/bootstrap-tour.min.css' rel='stylesheet'>
		<link href='css/jquery.noty.css' rel='stylesheet'>
		<link href='css/noty_theme_default.css' rel='stylesheet'>
		<link href='css/elfinder.min.css' rel='stylesheet'>
		<link href='css/elfinder.theme.css' rel='stylesheet'>
		<link href='css/jquery.iphone.toggle.css' rel='stylesheet'>
		<link href='css/uploadify.css' rel='stylesheet'>
		<link href='css/animate.min.css' rel='stylesheet'>

		<!-- jQuery -->
		<script src="bower_components/jquery/jquery.min.js"></script>

		<!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
		<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

		<!-- The fav icon -->
		<link rel="shortcut icon" href="img/favicon.ico">
		<script type="text/javascript">
			function checkAvaliable() {
				var name = document.getElementById("txtUsername").value;
				var pwd = document.getElementById("txtPassword").value;
				if (name == "") {
					document.getElementById("lblName").innerHTML = "请输入用户名";
					return false;
				} else {
					document.getElementById("lblName").innerHTML = "";
				}

				for (var i = 0; i < name.length; i++) {
					var j = name.substring(i, i + 1);
					if (j == " ") {
						document.getElementById("lblName").innerHTML = "用户名中包含了不可用的字符";
						return false;
					} else {
						document.getElementById("lblName").innerHTML = "";
					}
				}
				
				if (pwd == "") {
					document.getElementById("lblPassword").innerHTML = "请输入密码";
					return false;
				}
				if (pwd.length < 8) {
					document.getElementById("lblPassword").innerHTML = "密码格式错误";
					return false;
				}
			}
		</script>

	</head>

	<body style="background-image: url(img/2.jpg);overflow: hidden;">
		
		<div class="ch-container">
			<div class="row">

				<div class="row">
					<div class="col-md-12 center login-header">
						<h2>欢迎使用奥凯航空内部资源管理系统</h2>
					</div>
					<!--/span-->
				</div>
				<!--/row-->

				<div class="row">
					<div class="well col-md-5 center login-box">
						<div class="alert alert-info">
							请输入您的用户名与密码以登录
						</div>
						<form class="form-horizontal" action="index.html" method="get" onsubmit="return checkAvaliable()">
							<fieldset>
								<div class="input-group input-group-lg">
									<span class="input-group-addon"><i class="glyphicon glyphicon-user red"></i></span>
									<input type="text" class="form-control" id="txtUsername"  placeholder="用户名">									
								</div>
								<p style="font-size: 15px;margin: 0;padding: 0;color: red;" id="lblName"></p>
								<div class="clearfix"></div><br>

								<div class="input-group input-group-lg">
									<span class="input-group-addon"><i class="glyphicon glyphicon-lock red"></i></span>
									<input type="password" class="form-control" id="txtPassword" placeholder="密码">
								</div>
								<p style="font-size: 15px;margin: 0;padding: 0;color: red;" id="lblPassword"></p>
								<div class="clearfix" align="center"></div><br>
                                <div align="center" id="txtPassword-p"><input type="text" class="form-control" id="txtName" placeholder="请输入验证码"></div>
                                <div align="center"  id="txtPassword-p"><img src="img/1.png"width="80%"/></div>
                                <div style="clear: both;"></div><br>
								<div class="input-prepend">
									<label class="remember" for="remember"><input type="checkbox" id="remember"> 记住我</label>
								</div>
								<div class="clearfix"></div>

								<p class="center col-md-5">
									<button type="submit" class="btn btn-primary">登录</button>
								</p>
							</fieldset>
						</form>
					</div>
					<!--/span-->
				</div>
				<!--/row-->
			</div>
			<!--/fluid-row-->

		</div>
		<!--/.fluid-container-->

	</body>

</html>